<script lang="ts">
import {defineComponent, onMounted, onUnmounted} from "vue";
import {useLoadingBar} from "naive-ui";
import type {LoadingBarApi} from "naive-ui";

// 类型声明扩展
declare global {
  interface Window {
    $loading?: LoadingBarApi;
  }
}

export default defineComponent({
  name: "LoadingContent",
  setup() {
    const loadingBar = useLoadingBar();

    // 组件挂载时注册全局变量
    onMounted(() => {
      if (import.meta.env.PROD) {
        console.warn("Avoid using window.$loading in production");
      }
      window.$loading = loadingBar;
    });

    // 组件卸载时清理
    onUnmounted(() => {
      delete window.$loading;
    });

    // 返回空渲染函数（无渲染组件）
    return () => null;
  }
});
</script>
